<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>多媒体</title>
</head>
<body>
    <audio id="au" src="./media/水边的阿狄丽娜--Richard Clayderman.mp3" controls ></audio>
    <button id="mute">静音</button>
    <audio controls>
        <source src="./media/city.mp3" />
        <source src="./media/city.ogg" />
    </audio>
    <hr>
    <video controls src="./media/big_buck_bunny_480p_5mb.mp4"></video>
    <progress max="100" value="60"/>
    <script>
        const au = document.getElementById('au')
        const muteBtn = document.getElementById('mute')
        muteBtn.onclick = function(){
            // au.pause()
            au.muted = !au.muted
        }
    </script>
</body>
</html>